Practice exercises

Below are some questions to help you review and strengthen some of the things you've learned about HTML and CSS. These exercises are also designed to help you prepare for the upcoming project, which you'll see in the next section.

If you’re not sure of the answer to something, don’t worry—just take your best guess and then try to learn from it.

QUIZ QUESTION::

Match each HTML element with the kind of thing you might use it for.

ANSWER CHOICES:

HTML element	What you might use it for
For the title of a section.
As a container for other elements.
To make a hyperlink.
For a paragraph of text.

QUIZ QUESTION::

Match each of these pieces of code with what it is called.

ANSWER CHOICES:

Code	What is it?
Class selector
An HTML element with an inline style applied to it.
Element selector
An HTML element with a class applied to it.

For this next question, suppose you have a web page that has info about different kinds of cats. For each kind of cat, you have a heading that says the name of the cat, a paragraph of text about that kind of cat, and a picture of that kind of cat. Notice how this page has clusters of conceptually related content, like this:

Title about Calico cats
Paragraph about Calico cats
Image of Calico cats

Title about Manx cats
Paragraph about Manx cats
Image of Manx cats

Title about Siamese cats
Paragraph about Siamese cats
Image of Siamese cats

Suppose that you've used <div> container elements to divide up your page into a series of sections (like in the above page about cats).

Now you want to style each section in the same way, so that all of the sections are centered, have a 10px margin, and a purple border. What would be a good way to do this?

Create an element selector in your CSS file, so that all <div> elements on your page get the same styles.

Create a single class selector in your CSS file, and apply this one class to all of the sections.

Create multiple class selectors in your CSS file (one for each section).

Avoid selectors altogether; instead, apply an inline style to each section.

All done!

When you're ready to start on it, you'll find a detailed description of your next project on the Project Specification page. We hope that these questions helped prepare you for it!